<html>
<head>
<title>'flotstudy.jsp' Playing with JQuery and Flot</title>
<link href="css/flotexamples.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript" src="jquery/jquery.flot.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		//$.plot($("#placeholder"), [ d1, d2, d3 ]);
	});
</script>
<script type="text/javascript">
	function plotAccordingToChoices() {
		alert('plotAccordingToChoices() was called ..');
		var choiceContainer = $("#choices");
		var data = [];
		choiceContainer.find("input:checked").each(function() {
			var key = $(this).attr("name");
		});
	}
	$(document)
			.ready(
					function() {
						$
								.getJSON(
										"ServiceServlet?mode=getmeasurepoint",
										function(data) {
											var choiceContainer = $("#choices");
											for (i = 0; i < data.length; i++) {
												choiceContainer
														.append("<br/><input type='checkbox' name='" + data[i].id +
								"' checked='checked' id='id" + data[i].id + "'></input>"
																+ "<label for='id" + data[i].id + "'>"
																+ data[i].comment
																+ "</label>");
											}
											choiceContainer
													.find("input")
													.click(
															plotAccordingToChoices);
										});
						$.plot($("#placeholder"), [ ["1","8","2","7"] ]);
					});
</script>

</head>
<body>
	<div id="header">
		<h2>File 'flotstudy.jsp' of application 'WBH-Projekt-Studie'</h2>
	</div>
	<div id="content">

		<p>This page was created to play a little bit with Java-Script,
			JQuery, AJAX and Flot</p>

		<div class="demo-container">
			<div id="placeholder" class="demo-placeholder"></div>
		</div>
		<div>
			<!--   <p id="choices" style="float: right; width: 135px;"></p> -->
			<p id="choices"></p>
		</div>
		<p>It will be interisting to see, how this goes on ...</p>

		<p>The axes are automatically scaled.</p>
		<p>
			<a href="index.jsp">Back to index.jsp</a>
		</p>
	</div>

	<div id="footer">Layout adopted from http://www.flotcharts.org/
		(Examples)</div>

</body>
</html>